1、宽度自适应三列布局 　　三列布局的原理和两列布局的原理是一样的，只不过多了一列，只需给宽度自适应两列布局中间再加一列，然后重新计算三列的宽度，就实现了宽度自适应的三列布局。 　　同样的道理，更 ...

1、宽度自适应两列布局 　　两列布局可以使用浮动来完成，左列设置左浮动，右列设置右浮动，这样就省的再设置外边距了。 　　当元素使用了浮动之后，会对周围的元素造成影响，那么就需要清除浮动，通常使用两 ...

1、网页布局 　　布局（layout）即对事物的全面规划和安排，页面布局是对页面的文字、图像或表格进行格式化版式排列。网页布局对改善网站的外观非常重要，又称版式布局，大多数网站会把内容安排到多个列中 ...

1、混合布局 　　在了解了一列、两列和三列布局之后，混合布局也就不难理解了，混合布局也可以叫综合型布局，那么混合布局就可以在一列布局的基础之上，分为两列布局，三列布局，网页布局的结构普遍都是三列布局 ...

相关截图 练习要求 运用 flex 的相关属性和值，主要是 来帮助各种颜色的青蛙找到对应颜色的荷叶，总共 24 关卡。整体难度不高，趣味性较强。 最后一关 网址 FLEXBOX ...

1、CSS 盒模型（Box Model） 　　所有 HTML 元素都可以看作是盒子，在 CSS 中，“Box Model”这一术语主要是在布局时使用。 　　CSS 盒模型（Box Model）规定 ...